import 'package:cached_network_image/cached_network_image.dart';
import 'package:casdon/modules/recipe/data/model/recipe_placeholder_data.dart';
import 'package:casdon/modules/recipe/ui/widgets/play_orverlay_button.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class RecipeSearchItemWidget extends StatelessWidget {
  final String title;
  final String? imageUrl;
  final List<String> tags;
  final int peopleViewed;
  final bool isVideo;
  final VoidCallback? onTap;

  const RecipeSearchItemWidget({
    super.key,
    required this.title,
    this.imageUrl,
    required this.tags,
    required this.peopleViewed,
    this.isVideo = false,
    this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        margin: EdgeInsets.symmetric(horizontal: 16.w, vertical: 6.h),
        padding: EdgeInsets.all(12.w),
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(12.r),
          boxShadow: [
            BoxShadow(
              color: Colors.black.withOpacity(0.03),
              offset: const Offset(0, 1),
              blurRadius: 3,
            ),
          ],
        ),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            _buildImage(),
            SizedBox(width: 12.w),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style: TextStyle(
                      fontSize: 16.r,
                      fontWeight: FontWeight.w500,
                      color: Colors.black87,
                    ),
                  ),
                  SizedBox(height: 8.h),
                  Wrap(
                    spacing: 6.w,
                    runSpacing: 6.h,
                    children: tags.map((t) => _buildTag(t)).toList(),
                  ),
                  SizedBox(height: 8.h),
                  Text(
                    "$peopleViewed人已查看",
                    style: TextStyle(fontSize: 13.r, color: Colors.grey),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildImage() {
    if (imageUrl == null || imageUrl!.isEmpty) {
      return Container(
        width: 80.w,
        height: 80.w,
        decoration: BoxDecoration(
          color: const Color(0xFFF4F4F4),
          borderRadius: BorderRadius.circular(8.r),
        ),
        alignment: Alignment.center,
        child: const Text(
          "CASDON\n中国高端新厨电专家",
          textAlign: TextAlign.center,
          style: TextStyle(color: Colors.grey, fontSize: 10),
        ),
      );
    }

    return SizedBox(
      width: 80.w,
      height: 80.w,
      child: ClipRRect(
        borderRadius: BorderRadius.circular(8.r),
        child: Stack(
          fit: StackFit.expand,
          children: [
            CachedNetworkImage(
              imageUrl: imageUrl!,
              width: 80.w,
              height: 80.w,
              fit: BoxFit.cover,
              errorWidget: (_, __, ___) =>
                  Image.network(recipePlaceHolderImgUrl, fit: BoxFit.cover),
            ),
            if (isVideo) const PlayOverlayButton(),
          ],
        ),
      ),
    );
  }

  Widget _buildTag(String text) {
    Color bgColor;
    Color textColor;

    if (text == "智能菜谱") {
      bgColor = const Color(0xFFEAE6FF);
      textColor = const Color(0xFF6C63FF);
    } else {
      bgColor = const Color(0xFFF5F5F5);
      textColor = Colors.black54;
    }

    return Container(
      padding: EdgeInsets.symmetric(horizontal: 8.w, vertical: 3.h),
      decoration: BoxDecoration(
        color: bgColor,
        borderRadius: BorderRadius.circular(6.r),
      ),
      child: Text(
        text,
        style: TextStyle(fontSize: 12.r, color: textColor),
      ),
    );
  }
}
